<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style >
		#box{
				width: 100px;
				height: 100px;
				background-color: red;
			}
		</style>
	</head>
	<body>
	
		<div id="box"></div>
		
	</body>
	<script type="text/javascript">
			var box=document.getElementById('box')[0];
			box.onmousedown=function(){
			document.onmousemove=function(event){
box.style.marginLeft=event.clientX-50+"px";
box.style.marginTop=event.clientY-50+"px";

			
		}
		}
		box.onmouseup=function(){
			box.onmousemove="";
		};
	</script>
</html>
